// pages/index/index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    imgs:[
      { id: 1, src: '../../images/meinv1.jpg', animation: 'transform: rotateY(40deg) translateZ(250px);', display: 'display:block'},
      { id: 2, src: '../../images/meinv2.jpg', animation: 'transform: rotateY(80deg) translateZ(250px);', display: 'display:block' },
      { id: 3, src: '../../images/meinv3.jpg', animation: 'transform: rotateY(120deg) translateZ(250px);', display: 'display:block'},
      { id: 4, src: '../../images/meinv4.jpg', animation: 'transform: rotateY(160deg) translateZ(250px);', display: 'display:block'},
      { id: 5, src: '../../images/meinv5.jpg', animation: 'transform: rotateY(200deg) translateZ(250px);', display: 'display:block'},
      { id: 6, src: '../../images/meinv6.jpg', animation: 'transform: rotateY(240deg) translateZ(250px);', display: 'display:block' },
      { id: 7, src: '../../images/meinv7.jpg', animation: 'transform: rotateY(280deg) translateZ(250px);', display: 'display:block'},
      { id: 8, src: '../../images/meinv8.jpg', animation: 'transform: rotateY(320deg) translateZ(250px);', display: 'display:block' },
      { id: 9, src: '../../images/meinv9.jpg', animation: 'transform: rotateY(360deg) translateZ(250px);', display: 'display:block'}
    ],
    rotateX: 0,
    rotateY: 0,
    translateZ: 250,
    status: true,
    id: 9,
    status1: true,
    display:'none'
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    var rotateX = 0;
    var rotateY = 0;
    var translateZ = 250;
    var imgs = that.data.imgs;
    var id = 1;
    setInterval(function () {
      if(that.data.status == true){
        translateZ = that.data.translateZ - 2
        imgs.forEach(item => {
          item.animation = 'transform: rotateY(' + 40 * item.id + 'deg) translateZ(' + translateZ + 'px);'
        })
        that.setData({
          imgs: imgs,
          translateZ: translateZ
        })
        if (that.data.translateZ == 140){
          that.setData({
            status:false
          })
        }
      }else{
        translateZ = that.data.translateZ + 2
        imgs.forEach(item => {
          item.animation = 'transform: rotateY(' + 40 * item.id + 'deg) translateZ(' + translateZ + 'px);'
        })
        that.setData({
          imgs: imgs,
          translateZ: translateZ
        })
        if (that.data.translateZ == 250) {
          that.setData({
            status: true
          })
        }
      }
    }, 50)
    setInterval(function () {
      rotateX = that.data.rotateX + 1;
      that.setData({
        rotateX: rotateX
      })
    }, 40)
    setInterval(function () {
      id = that.data.id;
      if (that.data.status1 == true){
        imgs.forEach(item => {
          if (item.id == id) {
            item.display = 'display:none;'
          }
        })
        that.setData({
          imgs: imgs,
          id: id - 1
        })
        if (id == -5){
          that.setData({
            status1:false
          })
        }
        if (id == 0){
          that.setData({
            display: 'block'
          })
        }
      }else{
        imgs.forEach(item => {
          if (item.id == id) {
            item.display = 'display:block;'
          }
        })
        that.setData({
          imgs: imgs,
          id: id + 1
        })
        if (id == 10) {
          that.setData({
            status1: true
          })
        }
        console.log(id)
        if (id == 0) {
          that.setData({
            display: 'none'
          })
        }
      }
    }, 2000)
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
  
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
  
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
  
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
  
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
  
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
  
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
  
  }
})